<template>
<moyu-card title="转换列表">
  <template #option></template>
  <template #content>
    <moyu-table v-model="dataList" @select-row="getDetail">
      <el-table-column prop="transName" label="转换名称"/>
      <el-table-column prop="remark" label="备注"/>
      <el-table-column prop="createTime" label="创建时间" min-width="170"/>
    </moyu-table>
    <div class="moyu-pagination">
      <moyu-pagination v-model="queryParams" @select-page="getListPage"/>
    </div>
  </template>
</moyu-card>
</template>

<script setup>

import MoyuCard from "@/components/MoyuCard/MoyuCard.vue";
import {ref, onMounted} from 'vue'
import MoyuTable from "@/components/MoyuTable/MoyuTable.vue";
import {getTransListPage} from "@/api/kettle/trans";
import MoyuPagination from "@/components/MoyuPagination/MoyuPagination.vue";

const queryParams = ref({
  size: 20,
  current: 0,
  total: 0,
  transName: '',
  isUsed: ''
})

const dataList = ref([])

const getListPage = function () {
  getTransListPage(queryParams.value).then(value=>{
    queryParams.value.size = value.data.size
    queryParams.value.total = value.data.total
    queryParams.value.current = value.data.current
    dataList.value = value.data.records
  })
}

onMounted(getListPage)

const emit = defineEmits(['rowClick'])
/**
 * 获得选中行的数据
 */
const getDetail = function (row){
  emit('rowClick', row)
}
</script>

<style scoped>

</style>